/*
Theme Name: WordPress WordTrainer Default Theme
Theme URI: http://www.daveyyzermans.nl/projects/2011/07/30/wordpress-word-trainer/
Description: Default theme for the WordPress plugin built for one thing only: teaching words
Author: Davey IJzermans
Author URI: http://daveyyzermans.nl/
Version: 0.1
Tags: black, grey, white, fixed-width, translation-ready

License: GNU GPL v3
License URI: http://www.gnu.org/licenses/gpl.html
*/

@import url('css/reset.css'); /* reset 'em! */

/* 0. Spine */

html,body {
  font-family: "Arial";
  font-size: 15px;
  width: 100%;
}

body {
  background: url(images/bg.gif) repeat;
}

/* 1. Layout */

div.container {
	position: absolute;
	top: 50%; left: 50%;
  margin: -266px 0 0 -386px; padding: 35px;
	background: white;
	border: 1px solid #9aa8b6;
  height: 460px; width: 708px;
  
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
}

.banner {
	background: url(images/banner.png) no-repeat;
	margin: 0 -50px 25px -50px; padding: 0 5px 0 5px;
	color: white; font-size: 99px;
	font-weight: bold; text-align: center;
	line-height: 152px;
	white-space: nowrap;
	text-shadow: black -1px -1px 0;
	height: 152px; width: 798px;
}

.left_column {
  width: 440px;
  float: left;
}

.right_column {
  float: right;
}

div.footer {
	background: black;
	background: rgba(0,0,0,0.9);
	position: fixed;
	right: 0; bottom: 0; left: 0;
  padding: 11px;
  color: white;
  font-size: 12px;
}

/* 2. Info bar(s) */

div.bar {
  background: #e7e7e7;
  border: 1px solid #d1d1d1;
  border-bottom: none;
  padding: 8px;
  color: #737473;
  position: absolute;
  bottom: 0; left: 40px; right: 40px;
}

div .bar_centered {
  text-align: center;
}

div .bar_red {
  background: #be4140;
  border-color: #881a1a;
  color: #fefffe;
}

div .bar_blue {
  background: #4b8ad0;
  border-color: #244f94;
  color: #fefffe;
}

div .bar_red *,div .bar_blue *, {
  color: white;
}


/* 3. Elements */

h1, h2, h3, h4, h5, h6 {
  text-transform: uppercase;
	font-weight: bold;
	color: #314158;
}

h1 {
  font-size: 1.9em;
  margin: 0 0 .67em 0;
}

h2 {
  font-size: 1.5em;
  margin: 0 0 .75em 0;
}

h3 {
	font-size: 1.17em;
	margin: 0 0 .83em 0;
}

h4, p {
  margin: 0 0 1.12em 0;
}

h5 {
  font-size: .83em;
  margin: 0 0 1.5em 0;
}

h6 {
	font-size: .75em;
	margin: 0 0 1.67em 0;
}

a,a:visited {
  color: #314158;
  text-decoration: underline;
}

a:hover,a:active {
  color: #314158;
  text-decoration: none;
}

div.header h1 {
	text-align: center;
	font-size: 2.2em;
	color: white;
  margin: .67em 0;
}

.loader {
  background-image: url(images/ajax-loader.gif);
  background-position: center center;
  background-repeat: no-repeat;
  background-color: black;
  background-color: rgba(0,0,0,0.9);
  
  position: absolute;
  top: 50%; left: 50%;
  height: 77px; width: 77px;
  margin: -38px 0 0 -38px; padding: 0;
  display: none;
  color: white;
  
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
}

.loader p {
	margin: 0; padding: 0;
	text-align: center; font-size: 12px;
}

div.footer a {
	color: #d1d1d1;
}

/* 4. WordPress & tags */

.alignleft { text-align: left; }
.aligncenter { text-align: center; }
.alignright { text-align: right; }
.floatleft { float: left; }
.floatright { float: right; }
.floatnone { float: none; }
.clearleft { clear: left; }
.clearright { clear: right; }
.clearboth { clear: both; }